{extend name="public:head"}
{block name="main"}

<form class="layui-form" style="margin: 20px">
    <div class="demoTable">
        条件搜索：
        <div class="layui-inline">
            <select name="status">
                <option value="">全部状态</option>
                <option value="1">正常</option>
                <option value="0">禁用</option>
            </select>
        </div>
        <div class="layui-inline">
            <select name="grade">
                <option value="">推广等级</option>
                {volist name="gradeName" id="vo"}
                <option value="{$vo.grade_name}">{$vo.grade_name}</option>
                {/volist}
            </select>
        </div>
        <div class="layui-inline">
            <select name="category_id">
                <option value="">贷款类型</option>
                {volist name="categoryName" id="vo"}
                <option value="{$vo.category_id}">{$vo.category_name}</option>
                {/volist}
            </select>
        </div>
        <div class="layui-inline">
            <input class="layui-input" name="title"  autocomplete="off" placeholder="产品名称">
        </div>
        <div class="layui-input-inline">
            <input name="time" type="text" class="layui-input" id="date" placeholder="输入时间范围">
        </div>
        <div class="layui-inline">
            <button class="layui-btn" lay-filter="submit" lay-submit>搜索</button>
            <button class="layui-btn layui-btn-primary"  lay-filter="submit" lay-submit>重置</button>
        </div>

    </div>
</form>

<table class="layui-hide" id="all" lay-filter="all" lay-data="{id: 'sousuo'}"></table>

<script type="text/html" id="img_url">
    <img src="{{d.img_url}}" style="height: 24px"/>
</script>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-sm" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="del">删除</a>
</script>

<script type="text/html" id="application_url">
    <a class="layui-btn layui-btn-sm" lay-event="open_url">申请链接</a>
</script>

<script type="text/html" id="status">
    {{#  if(d.status == 1){ }}<button class="layui-btn layui-btn-xs">上架</button> {{#  } }}
    {{#  if(d.status == 0){ }}<button class="layui-btn layui-btn-xs layui-btn-disabled">下架</button> {{#  } }}
    {{#  if(d.repeat == 1){ }}<button class="layui-btn layui-btn-warm layui-btn-xs">重复</button> {{#  } }}
</script>

<script>
    layui.use(['table','layer','form','laydate'], function(){
        var table = layui.table;
        var layer = layui.layer;
        var laydate = layui.laydate;
        var form = layui.form;
        table.render({
            elem: '#all'
            ,url:'/admin/Product/getAllProductStatusByLayui'
            ,toolbar: '#toolbarDemo'
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'product_id', title:'ID',  fixed: 'left', unresize: true, sort: true}
                ,{field:'img_url', title:'缩略图',width:80,toolbar: '#img_url'}
                ,{field:'title', title:'产品名称'}
                ,{field:'grade', title:'推广等级'}

                ,{field:'px', title:'排序',sort: true}
                ,{field:'application', title:'申请人数'}
                ,{field:'success_application', title:'成功人数'}
                ,{field:'price_min', title:'最高额度'}
                ,{field:'price_max', title:'最低额度'}
                ,{field:'limit_time', title:'期限'}
                ,{field:'day_interest', title:'日利息'}
                ,{field:'application_url', title:'申请链接',toolbar: '#application_url',}
                ,{field:'status', title:'状态',width:120, templet:'#status',event:"status"}
                ,{field:'add_time', title:'添加时间'}
                ,{field:'up_time', title:'修改时间'}
                ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
            ]]
            ,page: true
        });
        // 表格重载 用于搜索
        form.on('submit(submit)', function(data){
            var field=data.field;
            if($(data.elem).html()=="重置"){
                $("input").val("");
                field="";
                table.render({
                    elem: '#all'
                    ,url:'/admin/Product/getAllProductByLayui'
                    ,toolbar: '#toolbarDemo'
                    ,cols: [[
                        {type: 'checkbox', fixed: 'left'}
                        ,{field:'product_id', title:'ID',  fixed: 'left', unresize: true, sort: true}
                        ,{field:'img_url', title:'缩略图',width:80,toolbar: '#img_url'}
                        ,{field:'title', title:'产品名称'}
                        ,{field:'grade', title:'推广等级'}

                        ,{field:'px', title:'排序',sort: true}
                        ,{field:'application', title:'申请人数'}
                        ,{field:'success_application', title:'成功人数'}
                        ,{field:'price_min', title:'最高额度'}
                        ,{field:'price_max', title:'最低额度'}
                        ,{field:'limit_time', title:'期限'}
                        ,{field:'day_interest', title:'日利息'}
                        ,{field:'application_url', title:'申请链接',toolbar: '#application_url',}
                        ,{field:'status', title:'状态',width:120, templet:'#status',event:"status"}
                        ,{field:'add_time', title:'添加时间'}
                        ,{field:'up_time', title:'修改时间'}
                        ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
                    ]]
                    ,page: true
                });
            }
            if($(data.elem).html()=="搜索") {
                table.reload('all', {
                    url: '/admin/Product/ConditionByProduct',
                    method: 'post',
                    where: {field}
                });
            }
            return false;
        });

        table.on('tool(all)', function(obj){
            var data = obj.data; //获得当前行数据
            var id = obj.data.product_id;
            var url = obj.data.application_url;
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            console.log(obj.data);
            if(obj.event == 'status'){
                var new_status = data.status;
                if(data.status){
                    new_status = 0;
                    form.render();
                }else {
                    new_status = 1
                    form.render();
                }
                console.log(data.status+'...');
                $.post("{:Url('admin/Popularize/upStatus')}",{'id': data.id , 'status': new_status},function(data){
                    console.log(data.code);
                    if(data.code = 200){
                        console.log('success');
                    }
                })
            }
            if(obj.event == 'edit'){
                console.log('edit_1');
                window.location.href= ("/admin/Product/addProduct/id/"+id);
            }
            if(obj.event == 'del'){
                layer.confirm('真的删除行么', function(index){
                    layer.close(index);
                    console.log(data);
                    //向服务端发送删除指令
                    $.post("{:Url('admin/Product/del')}",{'id': data.product_id},function(data){
                        console.log(data.code);
                        if(data.code == 300 ||data.code == 500){
                            layer.msg('删除失败！！！请重试');
                        }
                        if(data.code == 200){
                            layer.msg('删除成功！！！');
                            obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                        }
                    })
                });
            }
            if(obj.event == 'open_url'){
                //iframe层-父子操作
                layer.open({
                    type: 2,
                    area: ['700px', '450px'],
                    fixed: false, //不固定
                    maxmin: true,
                    content: url
                });
            }
        });
        $('#all').on('click', function(){
            layer.msg('hello');
        });
        laydate.render({
            elem: '#date' //指定元素
            ,range: '.'
        });
    });
</script>


{/block}